.customer-service{
  color: #333;
  .service-logo{
    width: 120px;
    height: 120px;
    right: 30px;
    bottom: 20vh;
    z-index: 200;
    position: fixed;
  }

  .modal-box{
    width: 600px;
    overflow: hidden;
    background: #fff;
    border-radius: 24px;
  }

  .head-img{
    height: 194px;
  }
  .modal-body{
    padding: 30px;
    .service-detail{
      width: 100%;
      font-size: 30px;
    }
    .info-item{
      margin-top: 30px;
    }
    .item-icon{
      font-size: 50px;
    }
    .info-text{
      flex: 1;
      padding: 0 20px;
    }
    .info-button{
      padding: 8px 24px;
      overflow: hidden;
      font-size: 20px;
      border-radius: 8px;
    }
    .call{
      background: #FFA800;
    }
    .copy{
      background: #FFDD00;
    }
  }
  .service-btn{
    color: $theme_text_color;
    height: 80px;
    margin: 30px;
    font-size: 32px;
    background: $theme_color;
    border-radius: 80px;
    &:after{
      border: 0;
    }
  }

  .modal-close{
    position: relative;
  }
  .close-btn{
    top: calc(100% + 40px);
    left: 50%;
    width: 64px;
    height: 64px;
    position: absolute;
    transform: translateX(-50%);
    background: #e0e0e0;
    border-radius: 50%;
  }
  .close-icon{
    color: #2a2a2a;
    font-size: 50px;
  }


  .qr-code{
    padding: 0 30px 30px;
    &-img{
      width: 300px;
      height: 300px;
    }
    &-text{
      font-size: 32px;
    }
  }
}
